<!-- banner -->
<div class="banner-top visible-md-block visible-lg-block" >
    <div class="callbacks_container" style="position: relative">
        <div class="swiper-container" id="bannerSwiper">
            <div class="swiper-wrapper">
                @for (item in bannerPic){
                <div class="swiper-slide">
                    <div style="width:100%;height:0;padding-top:25%;background-image: url(${item.pic});background-repeat: no-repeat;background-position: center;background-size: cover;">
                        <div style="position:absolute;left:30px;bottom:20px;font-size:16px;color:#ffffff;">${item.title}</div>
                    </div>
                </div>
                @}
            </div>
            <!-- Add Pagination -->
            <div class="swiper-pagination"></div>
        </div>
    </div>

</div>
<!-- //banner -->

<!--mobile -->
<div class="visible-sm-block visible-xs-block banner-test-height">
    <div class="callbacks_container">
        <div class="swiper-container" id="bannerSwiperMobile">
            <div class="swiper-wrapper">
                @for (item in bannerPic){
                <div class="swiper-slide">
                    <div style="width:100%;height:0;padding-top:40%;background-image: url(${item.mobilePic});background-repeat: no-repeat;background-position: center;background-size: cover;">
                        <div style="position:absolute;left:20px;bottom:20px;font-size:16px;color:#ffffff;">${item.title}</div>
                    </div>
                </div>
                @}
            </div>
            <!-- Add Pagination -->
            <div class="swiper-pagination"></div>
        </div>
    </div>
</div>
</div>

<!-- //mobile -->
<script type="text/javascript">
    $(function (){
        var bannerSwiper = new Swiper('#bannerSwiper', {
            pagination: '.swiper-pagination',
            autoplay:5000,
            loop:true,
            paginationClickable :true,
            autoHeight:true,
        });

        var mobileBanner = new Swiper('#bannerSwiperMobile',{
            pagination: '.swiper-pagination',
            autoplay:5000,
            loop:true,
            paginationClickable :true,
            autoHeight:true,
        })
    })
</script>